<template>
  <div class="my-container">
    <van-nav-bar
      left-arrow
      left-text="我的关注"
      fixed
      :border="false"
      @click-left="$router.back()"
      class="nav"
    >
    </van-nav-bar>

    <van-tabs
      v-model="active"
      background="#3f51b5"
      color="#fff"
      :border="false"
      sticky
      offset-top="46"
    >
      <van-tab title="家服公司">
        <Frim :frimList="frimList" />
      </van-tab>
      <van-tab title="家服人员">
        <!--家政服务人员  -->
        <ServiceStaff :StaffList="StaffList" />
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import Frim from "@/component/frim/frim.vue";
import ServiceStaff from "@/component/serviceStaff/serviceStaff.vue";
import request from "@/utils/request";

export default {
  components: { Frim, ServiceStaff },
  data() {
    return {
      active: 0,
      frimList: [],
      StaffList: [],
    }
  },
  
  created() {
    this.getFrimMessage();
    this.getServiceStaff();
  },
  methods: {
    //获取公司信息
    async getFrimMessage() {
      const { data } = await request("/company?allow=1");
      this.frimList = data;
    },

    // 获取家政人员信息
    async getServiceStaff() {
      const { data } = await request("/staff?allow=1");
      this.StaffList = data;
    },
  },
};
</script>

<style lang="less" scoped>
.my-container {
  padding: 92px 0px 100px;

  .nav {
    background-color: #3f51b5;
    z-index: 5;
  }
  /deep/ .van-nav-bar .van-icon {
    color: #fff;
  }
  /deep/.van-nav-bar__text {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
  }

  .van-tabs {
    /deep/ .van-tab__text {
      color: #fff;
      font-weight: bold;
      font-size: 12px;
    }
  }
}
</style>